
<style>
  .box-item {
    margin-bottom: 20px;
    text-align: center;
  }
  .box-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
  }
  .box-text {
    margin-top: 10px;
    font-weight: bold;
    font-size: 16px;
  }
  .box-description {
    margin-top: 5px;
    color: #666;
    font-size: 14px;
  }
  .box-footer {
    margin-top: 10px;
  }
</style>
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <el-col :span="6" v-for="(item, index) in list" :key="index">
        <el-card class="box-item">
          <img :src="item.logo" class="box-image" />
          <div class="box-text">{{ item.mallName }}</div>
          <div class="box-description">{{ item.mallDesc }}</div>
          <div class="box-footer">
            <el-button type="text" @click="gotoshop(item.mallId)">进入管理</el-button>
          </div>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { listMall } from "@/api/system/mall";
import { pddGoodsList } from "@/api/system/pddGoods";
import {pddSyncPddData,jiankongPddData} from "@/api/system/pdd";
export default {
  name: "Shop",
  data() {
    return {
      // 遮罩层
      loading: true,
      list: [],
      total : 0,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询拼多多店铺列表 */
    getList() {
      this.loading = true;
      listMall(this.queryParams).then(response => {
        this.list = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    gotoshop(mallId) {
      this.$router.push("/system/goods/index/" + mallId);
    }
  }
};
</script>
